    <style>
    .floating-panel{float:left; padding-right: 20px;}
    </style>
    <div class="panel-heading" style="height: 45px;">
        <div class="floating-panel">
        <%= bartitle %>
        </div>
        <div class="floating-panel controlbar">
        <a href="#" class='btn btn-primary btn-xs' onclick="exportDataCSV()">导出数据</a>
        <a href="?type=1" class='btn <% if(data.type == 1) { %> btn-success <% } else { %> btn-primary <% } %> btn-xs'>7天</a>
        <a href="?type=2" class='btn <% if(data.type == 2) { %> btn-success <% } else { %> btn-primary <% } %> btn-xs'>30天</a>
        <a href="#" onclick="showTimePanel()" class='btn <% if(data.type == 5) { %> btn-success <% } else { %> btn-primary <% } %> btn-xs'>自定义</a>
        </div>
        <div class="floating-panel" id="timepanelSelect" <% if(data.type != 5) { %> style="display: none;" <% } %>>
            从
            <input class="dateonly" type="text" value="<%- data.begin || '' %>" id="dtBeginDate" readonly/>
            到
            <input class="dateonly" type="text" value="<%- data.end || '' %>" id="dtEndDate" readonly/>
            <a href="#" class='btn btn-danger btn-xs' onclick="customFilter()">确定</a>
        </div>

    </div>
    <script type="text/javascript">
        function showTimePanel(){
            $(".controlbar>a").removeClass("btn-success");
            $(".controlbar>a").attr("class","btn btn-primary btn-xs");
            $(".controlbar>a:last").attr("class","btn btn-success btn-xs");
            $("#timepanelSelect").show();
        }
        function customFilter(download){
            //检查时间
            var begintimeStr = $("#dtBeginDate").val()+" 00:00:00";
            var endtimeStr = $("#dtEndDate").val()+" 23:59:59";

            var beginTime = new Date(begintimeStr);
            var endTime = new Date(endtimeStr);
            if(isNaN(beginTime) || isNaN(endTime)){
                ShowErrorMsg('您的浏览器版本太低，不能识别正确的时间格式');
                return;
            }
            
            if(beginTime >= endTime){
                ShowErrorMsg('时间范围不正确');
                return;
            }
            beginTime = beginTime.toLocaleDateString();
            endTime = endTime.toLocaleDateString();
            if(download){
                window.document.location.href="?action=download&type=5&begin="+beginTime+"&end="+endTime;
            }
            else{
                window.document.location.href="?type=5&begin="+beginTime+"&end="+endTime;
            }
        }
        function exportDataCSV(){
            customFilter(true);
        }
    </script>
<%- include("../jspart/with-datetimepicker") %>
 
 <script>
   $(document).ready(function(){
    $('input.dateonly').datetimepicker({"format":"yyyy/mm/dd","autoclose":true,"startView":2,"maxView":4,"minView":2,"language":"zh-CN"});
   });
 </script>